<template>
  <div class="footer">
    <el-row class="footer_info top">
      <el-col :span="11" class="left info_block">
        <el-row class="phone">客服热线: 021-68810661-808</el-row>
        <el-row>服务时间：上午8:30--下午20:00 ( 工作日 )</el-row>
        <el-row class="address">地址：上海市浦东新区浦三路21弄55号604室( 银亿滨江中心壹号 )</el-row>
      </el-col>
      <el-col :span="5" class="center info_block">
        <el-row>
          <span><a href="/guide/about" target="_blank">关于我们</a></span>
          <span><a href="/guide/news/" target="_blank">新闻公告</a></span>
        </el-row>
        <el-row>
          <span><a href="/guide/quality/" target="_blank">平台优势</a></span>
          <span><a href="/guide/business/" target="_blank">商务合作</a></span>
        </el-row>
        <el-row>
          <span><a href="/guide/suppor/" target="_blank">帮助中心</a></span>
          <span><a href="/guide/security/" target="_blank">安全保障</a></span>
        </el-row>
      </el-col>
      <el-col :span="8" class="right info_block">
        <dl>
          <dt><img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/pzg.png" alt=""></dt>
          <dd>成为票掌柜渠道商</dd>
        </dl>
        <dl>
          <dt><img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/hpx.png" alt=""></dt>
          <dd>下载汇票线APP</dd>
        </dl>
        <dl>
          <dt><img src="https://hpx-file.oss-cn-hangzhou.aliyuncs.com/hpxpic/7b8060ef-327c-4ceb-8f79-abef301db888.png" alt=""></dt>
          <dd>计算器小程序</dd>
        </dl>
      </el-col>
    </el-row>
    <el-row class="footer_info bottom">
      <el-col :span="11">©Copyright 2016 汇票线-上海票趣信息科技有限公司 &nbsp;<a href="http://www.miitbeian.gov.cn" target="_blank">沪ICP备16031524号-1</a> </el-col>
      <el-col :span="12" id="ssl">
        <!-- <script language="javascript" type="text/javascript" src="https://seal.wosign.com/tws.js"></script> -->
        <!-- <img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/safe_icon1.png" alt="数据已加密"> -->
        <span class="sslslogn">
          <a id="jm" target="_blank" href="https://seal.wosign.com/details/www.huipiaoxian.com"><img src="https://seal.wosign.com/Signature/Profiles/Icon/CN/OV_tp1_cn.png" /></a>
        </span>
        <img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/safe_icon2.png" alt="浦东新区电子商务行业协会会员">
        <img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/safe_icon3.png" alt="B2B产业发展联盟会员">
        <img src="https://hpx-pc.oss-cn-beijing.aliyuncs.com/hpxpic/commerceRecord.png" @click="interCard" alt="工商网监电子标识">
      </el-col>
    </el-row>
  </div>
</template>

<script lang="ts">
  import {Vue, Component} from 'vue-property-decorator'

  @Component
  export default class PageFooter extends Vue {
    data() {
        return {
            ssl_certificate: `<!DOCTYPE html>
                      <html lang="en">
                        <head>
                        </head>
                        <body>
                        <div class="wosign" style="height: 36px;">
                            <script language="javascript" type="text/javascript" src="https://seal.wosign.com/tws.js"><\/script>
                        </div>
                        </body>
                      </html>`
        }
    }
    interCard () {
      window.open('http://218.242.124.22:8081/businessCheck/verifKey.do?showType=extShow&serial=9031000020160601094501000000875554-SAIC_SHOW_310000-20190228165151984080&signData=MEUCIQCX/Iu+HPoQmS0Wzix3GKVXrQOmMjtnXlYX7gQdwQNqKQIgPtPW8h/yE483WHPJSlot9EvDpvAm8I6xxuvIQ6TvlCM=')
    }
    created() {
      // let recaptchaScript = document.createElement('script')
      // recaptchaScript.setAttribute('src', 'https://seal.wosign.com/tws.js')
      // document.getElementById('ssl').appendChild(recaptchaScript)
    }
  }
</script>

<style lang="scss" scoped>
.sslslogn{
  width: 120px;
  height: 36px;
  display: inline-block;
  .wosign{
    img{
      width: 120px;
      height: 36px;
    }
  }
}
.footer{
  width: 100%;
  height: 174px;
  background-color: $__color-show;
  padding: 30px 0 20px 0;
  .footer_info{
    width: 1200px;
    margin: 0 auto;
    font-size: 1.4rem;
  }
  .top{
      height: 138px;
      .info_block{
        height: 100%;
        color: $__color-border;
        .el-row{
          height: 22px;
          line-height: 22px;
          margin-bottom: 24px;
          font-size: 16px;
        }
        .phone{
          font-size: 2.4rem;
          color: #fff;
          height: 33px;
          line-height: 33px;
          margin-bottom: 10px;
        }
        .address{
          font-size: 14px;
        }
      }
      .center{
        color: #fff;
        font-size: 1.6rem;
        .el-row{
          margin-bottom: 18px;
          span{
            display: inline-block;
            height: 22px;
            margin-right: 50px;
          }
        }
        .el-row:first-child{
          margin-top: 6px;
        }
      }
      .right{
        dl{
          width: 120px;
          float: right;
          margin: 0;
          margin-left: 10px;
          color: #fff;
          dd, dt{
            margin: 0;
            text-align: center;
            img{
              width: 100px;
              height: 100px;
            }
          }
        }
      }
    }
    .bottom{
      color: $__color-border;
      height: 36px;
      line-height: 36px;
      img{
        width: 120px;
        height: 36px;
        margin-right: 16px;
        float: left;
        &:nth-child(4){
          cursor: pointer;
        }
      }
    }
}
</style>